<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<title>ECharts</title>
	<!-- 引入 echarts.js -->
	<script src="./echarts.min.js"></script>
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.css"
		integrity="sha384-bsHo4/LA+lkZv61JspMDQB9QP1TtO4IgOf2yYS+J6VdAYLVyx1c3XKcsHh0Vy8Ws" crossorigin="anonymous">
	<script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.js"
		integrity="sha384-4z8mjH4yIpuK9dIQGR1JwbrfYsStrNK6MP+2Enhue4eyo0XlBDXOIPc8b6ZU0ajz" crossorigin="anonymous">
	</script>
	<script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/contrib/auto-render.min.js"
		integrity="sha384-kWPLUVMOks5AQFrykwIup5lo0m3iMkkHrD0uJ4H5cjeGihAutqP0yW0J6dpFiVkI" crossorigin="anonymous"
		onload="renderMathInElement(document.body);"></script>
</head>

<body>
	我是一个粉刷匠\(\dfrac{x^2}{a^2} + \dfrac{y^2}{b^2} = 1\)
	\(\overbrace {blog}_{lindexi} + \underbrace {lindexi.github.io}_{doubi}\)
	\(\sqrt{x} \quad \sqrt[3]{x} \quad \sqrt{x^{2}+ \sqrt{y}}\)
	<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
	<div id="roots" style="width: 400px;height:400px;"></div>
	<!-- <div id="leaves" style="width: 400px;height:400px;"></div> -->
	<!-- <script type="text/javascript">
		
		let rootsChart = echarts.init(document.getElementById('roots'));

		let stduyTime = 0
		let dailyTime = 0
		let playTime = 0
		let emergencyTime = 0
		let sportTime = 0
		

		let tasks = android.tasks().split("\n")
		for (let i = 0; i < tasks.length - 1; i++) {
			let task = tasks[i].split(' ')
			let type = task[0]
			let time = parseInt(task[4])

			switch (type) {
				case 'Study':
					stduyTime += time
					break
				case 'Daily':
					dailyTime += time
					break
				case 'Play':
					playTime += time
					break
				case 'Emergency':
					emergencyTime += time
					break
				default:
					sportTime += time
			}
		}

		option = {
			tooltip: {
				trigger: 'item',
				formatter: '{a} <br />{b}: {c} ({d}%)'
			},
			series: [{
				name: '组成',
				type: 'pie',
				radius: ['50%', '70%'],
				avoidLabelOverlap: false,
				label: {
					show: false,
					position: 'center'
				},
				emphasis: {
					label: {
						show: true,
						fontSize: '30',
						fontWeight: 'bold'
					}
				},
				labelLine: {
					show: false
				},
				data: [{
						value: stduyTime,
						name: '学习'
					},
					{
						value: dailyTime,
						name: '日常'
					},
					{
						value: playTime,
						name: '娱乐'
					},
					{
						value: emergencyTime,
						name: '紧集事件'
					},
					{
						value: sportTime,
						name: '运动'
					}
				]
			}]
		};

		rootsChart.setOption(option)
	</script> -->
</body>

</html>